<template>
    <el-dialog v-model="dialogVisible" :close-on-click-modal="false" title="编辑还品提醒" width="30%" destroy-on-close
        @close="close">
        <el-form ref="ruleFormRef" :model="formData" :rules="rules" label-width="120px" class="demo-ruleForm">
            <el-form-item label="主播部门" prop="coreName">
                <el-input v-model="formData.coreName" max="10" disabled placeholder="请输入主播部门" />
            </el-form-item>
            <el-form-item label="主播级别" prop="coreLevel" v-hasPermi="['huanpin:zongjingban:edit']">
                <el-radio-group v-model="formData.coreLevel" class="ml-4">
                    <el-radio v-for="item in hm_core_level" :key="item.value" :label="item.value">{{ item.label
                        }}</el-radio>
                </el-radio-group>
            </el-form-item>
            <el-form-item label="对接人" prop="contactName">
                <el-input v-model="formData.contactName" max="10" placeholder="请输入对接人" />
            </el-form-item>
            <el-form-item label="联系方式" prop="contact">
                <el-input v-model="formData.contact" placeholder="请输入联系方式" />
            </el-form-item>
            <!-- <el-form-item label="提醒方式" prop="pushType">
                <el-checkbox-group v-model="formData.pushType">
                    <el-checkbox label="短信通知">短信通知</el-checkbox>
                    <el-checkbox label="系统消息">系统消息</el-checkbox>
                </el-checkbox-group>
            </el-form-item> -->
            <el-form-item label="还品期限" prop="cycle" v-hasPermi="['huanpin:chanpin:edit']">
                <el-input-number v-model="formData.cycle" :min="isShow()" :max="99" />
                <span style="display: inline-block;margin-left: 15px;">天</span>
            </el-form-item>
        </el-form>
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="close(ruleFormRef)">取消</el-button>
                <el-button type="primary" v-loading="loading" @click="submit(ruleFormRef)"
                    v-throttle:click>确认</el-button>
            </span>
        </template>
    </el-dialog>
</template>
<script setup lang="ts">
const { proxy } = getCurrentInstance() as any;
import { ref, defineExpose, defineEmits } from 'vue'
import { returnConfigEdit } from '@/api/group/returnGoodsInform/index'
import { ElMessage } from 'element-plus'
import useUserStore from '@/store/modules/user';
const { permissions } = useUserStore();
const emit = defineEmits(['getList'])

// 字典
const { hm_core_level } = toRefs<any>(proxy?.useDict('hm_core_level'));

const ruleFormRef = ref()
const dialogVisible = ref<Boolean>(false)
const loading = ref<boolean>(false)
const formData = ref<any>({
    coreName: '',
    coreLevel: "not_head",
    contactName: '',
    contact: '',
    // pushType: [],
    cycle: 3
})

const validatePhone = (rule: any, value: string, callback: any) => {
    if (value) {
        return /^(?:(?:\+|00)86)?1\d{10}$/.test(value)
    } else {
        return true
    }
}
const validatePeriod = (rule: any, value: string, callback: any) => {
    return /^[0-9]\d?$|^99$/.test(value)
}

const rules = ref({
    coreName: [
        { required: true, trigger: 'change', message: '请输入主播部门' }
    ],
    contact: [{ validator: validatePhone, trigger: 'change', message: '请输入正确的手机号' }],
    // pushType: [{ required: true, trigger: 'change', message: '请选择提醒方式' }],
    cycle: [{ required: true, trigger: 'change', message: '请输入还品期限' }, { validator: validatePeriod, trigger: 'change', message: '只能输入3到99之间的整数' }]
})

const open = (row: any) => {
    dialogVisible.value = true
    formData.value = JSON.parse(JSON.stringify(row))
}

// 提交
const submit = async (formEl: any) => {
    if (!formEl) return
    await formEl.validate((valid: any, fields: any) => {
        if (valid) {
            submitForm(formEl)
        } else {
            console.log('error submit!', fields)
        }
    })

}
// api调用
const submitForm = async (formEl: any) => {
    loading.value = true
    try {
        const res = await returnConfigEdit(formData.value)
        loading.value = false
        ElMessage({
            message: '修改成功',
            type: 'success',
        })
        emit('getList')
        close(formEl)
    } catch (error) {
        loading.value = false
    }
}
// 关闭
const close = (formEl: any) => {
    if (!formEl) return
    formEl.resetFields()
    dialogVisible.value = false
}

const isShow = () => {
    const chanpin = permissions.some((permi) => {
        return permi === '*:*:*' || ['huanpin:chanpin:edit'].includes(permi);
    });
    return chanpin ? 3 : 0
}


defineExpose({ open })
</script>
<style lang="scss" scoped>
@import url(../style/index.scss);
</style>